<template>
  <div class="line-detail">
    <span class="table-blue" @click="back">
      <i class="iconfont icon-left"></i>返回
    </span>
    <Form class="businessForm" :model="busSetting" label-position="right" :label-width="140">
      <div v-if="edit">
        <div class="title">Id配置</div>
        <div class="box">
          <Row>
            <i-col span="18">
              <Row>
                <i-col span="12">
                  <FormItem label="Model_Id">
                    <Row>
                      <i-col span="24">
                        <i-input v-model="busSetting.modelId" :disabled="edit"></i-input>
                      </i-col>
                    </Row>
                  </FormItem>
                </i-col>
              </Row>
            </i-col>
          </Row>
        </div>
      </div>
      <div class="title">类型配置</div>
      <div class="box">
        <Row>
          <i-col span="18">
            <Row>
              <i-col span="12">
                <FormItem label="类型">
                  <Row>
                    <i-col span="24">
                      <Select v-model="busSetting.modelType" style="width:200px" :disabled="edit">
                        <Option v-for="item in typeList" :value="item.ename" :key="item.cname">{{ item.cname }}</Option>
                      </Select>
                    </i-col>
                  </Row>
                </FormItem>
              </i-col>
            </Row>
          </i-col>
        </Row>
      </div>
      <div class="title">基础配置</div>
      <div class="box">
        <Row>
          <i-col span="18">
            <Row>
              <i-col span="12">
                <FormItem label="业务名称" v-if="busSetting.modelType === 'task'">
                  <Row>
                    <i-col span="24">
                      <i-input v-model="busSetting.modeName" placeholder="业务标注方式名称"></i-input>
                    </i-col>
                  </Row>
                </FormItem>
                <FormItem label="勋章名称" v-if="busSetting.modelType === 'medal'">
                  <Row>
                    <i-col span="24">
                      <i-input v-model="busSetting.modeName" placeholder="勋章名称"></i-input>
                    </i-col>
                  </Row>
                </FormItem>
              </i-col>
              <i-col span="12">
                <FormItem label="简短描述">
                  <Row>
                    <i-col span="24">
                      <i-input v-model="busSetting.describe" placeholder="简短描述"></i-input>
                    </i-col>
                  </Row>
                </FormItem>
              </i-col>
            </Row>
          </i-col>
        </Row>
      </div>

      <div class="title" v-if="busSetting.tasks">业务配置</div>

      <div class="box">
        <Row>
          <i-col span="18">
            <Row>
              <i-col span="12" v-for="(value,key) in busSetting.tasks" :key="key + 'aaaaa'">
                <FormItem v-if="taskflowNode.indexOf(key)=='-1' && key != 'flow'" :label="cname[key]">
                  <Row>
                    <i-col span="24">
                      <i-input v-model="busSetting.tasks[key]" :placeholder="key"></i-input>
                    </i-col>
                  </Row>
                </FormItem>
                <FormItem v-else-if="taskflowNode.indexOf(key)!='-1' && key != 'flow'" :label="cname[key]" >
                  <Row>
                    <i-col span="24">
                      <i-select filterable v-model="busSetting.tasks[key]" placeholder="请选择">
                        <i-option
                          v-for="(item,index) in pipelineList"
                          :key="item.id+index+key"
                          :value="item.id"
                        >{{item.name}}</i-option>
                      </i-select>
                    </i-col>
                  </Row>
                </FormItem>
              </i-col>
            </Row>
          </i-col>
        </Row>
      </div>
      <!-- 流转设置 -->
      <div class="title">后处理</div>
      <div class="box">
        <Row>
          <i-col span="18">
            <Row>
              <i-col span="12">
                <FormItem
                  v-for="(item, index) in busSetting.flowTask"
                  :key="index">
                  <Row>
                    <i-col span="18">
                      <i-select filterable v-model="item.value" placeholder="请选择" @on-change="changeFlowTask(item)">
                        <i-option
                          v-for="(items,indexs) in pipelineList"
                          :key="indexs"
                          :value="items.id"
                        >{{items.name}}</i-option>
                      </i-select>
                    </i-col>
                    <i-col span="4" offset="1">
                      <Button @click="handleRemove(index)">删除</Button>
                    </i-col>
                  </Row>
                </FormItem>
                <FormItem>
                  <Row>
                    <i-col span="12">
                      <Button type="dashed" long @click="handleAdd()" icon="md-add">增加</Button>
                    </i-col>
                  </Row>
                </FormItem>
              </i-col>
            </Row>
          </i-col>
        </Row>
      </div>
      <!--回收转移放弃-->
      <div class="title">回收配置</div>

      <div class="box">
        <Row>
          <i-col span="21">
            <Row>
              <i-col span="6">
                <FormItem label="提交已标注">
                  <Row>
                    <i-col span="24">
                      <Checkbox v-model="flow[0].recovery.isSubmitProcessed" @on-change="recoveryChange">
                        <span v-if="flow[0].recovery.isSubmitProcessed">是</span>
                        <span v-else>否</span>
                      </Checkbox>
                    </i-col>
                  </Row>
                </FormItem>
              </i-col>
            </Row>
          </i-col>
        </Row>
      </div>
      <div class="title">转移配置</div>

      <div class="box">
        <Row>
          <i-col span="21">
            <Row>
              <i-col span="6">
                <FormItem label="提交已标注">
                  <Row>
                    <i-col span="24">
                      <Checkbox v-model="flow[0].transfer.isSubmitProcessed" @on-change="transferChange">
                        <span v-if="flow[0].transfer.isSubmitProcessed">是</span>
                        <span v-else>否</span>
                      </Checkbox>
                    </i-col>
                  </Row>
                </FormItem>
              </i-col>
            </Row>
          </i-col>
        </Row>
      </div>
      <div class="title">放弃配置</div>

      <div class="box">
        <Row>
          <i-col span="21">
            <Row>
              <i-col span="5">
                <FormItem label="保存标注结果">
                  <Row>
                    <i-col span="24">
                      <Checkbox v-model="flow[0].giveup.isRemoveResult" @on-change="giveupMark">
                        <span v-if="flow[0].giveup.isRemoveResult == true">是</span>
                        <span v-else>否</span>
                      </Checkbox>
                    </i-col>
                  </Row>
                </FormItem>
              </i-col>
              <i-col span="5">
                <FormItem label="保存检查结果">
                  <Row>
                    <i-col span="24">
                      <Checkbox v-model="flow[1].giveup.isRemoveResult" @on-change="giveupCheck">
                        <span v-if="flow[1].giveup.isRemoveResult == true">是</span>
                        <span v-else>否</span>
                      </Checkbox>
                    </i-col>
                  </Row>
                </FormItem>
              </i-col>
              <i-col span="5">
                <FormItem label="保存质检结果">
                  <Row>
                    <i-col span="24">
                      <Checkbox v-model="flow[2].giveup.isRemoveResult" @on-change="giveupTest">
                        <span v-if="flow[2].giveup.isRemoveResult == true">是</span>
                        <span v-else>否</span>
                      </Checkbox>
                    </i-col>
                  </Row>
                </FormItem>
              </i-col>
            </Row>
          </i-col>
        </Row>
      </div>

      <!--/回收转移放弃-->
      <div v-if="modelId!=''" class="title">路由配置</div>

      <div v-if="modelId!=''" class="box">
        <Row>
          <i-col span="18">
            <Row>
              <i-col span="12" v-for="(value,key) in busSetting.views" :key="key + 'bbbbb'">
                <FormItem :label="cname[key]" >
                  <Row>
                    <i-col span="24">
                      <i-select v-model="busSetting.views[key]" disabled>
                        <i-option
                          v-for="(item,index) in historyViewList[key]"
                          :key="item+index"
                          :value="item"
                        >{{item}}</i-option>
                      </i-select>
                    </i-col>
                  </Row>
                </FormItem>
              </i-col>
            </Row>
          </i-col>
        </Row>
      </div>
      <Row>
        <i-col span="18" style="text-align:left; margin:50px 0;">
          <Row>
            <i-col span="8">&nbsp;</i-col>
            <i-col span="8">
              <div style="padding-left:140px;">
                <Button type="primary" style="width:120px;" :loading="loading" size="large" @click="saveBusiness">提 交</Button>
              </div>
            </i-col>
            <i-col span="8">&nbsp;</i-col>
          </Row>
        </i-col>
      </Row>
    </Form>

  </div>
</template>

<script>
import { getListDetail, getKeys, saveListDetail, getPipeline } from 'http/api/linemanage';

export default {
  name: 'LineDetail',
  data () {
    return {
      edit: false,
      type: 'task',
      typeList: [{cname: '业务线', ename: 'task'}, {cname: '勋章', ename: 'medal'}],
      modelId: '',
      busSetting: {// 新增和编辑需要传递的参数
        modeName: '',
        modelId: '',
        modelType: 'task',
        describe: '',
        tasks: {
          createBatchTaskFlowId: '',
          taskExportTaskFlowId: '',
          recoveryStrategy: '',
          transferStrategy: '',
          createMedalTaskFlowId: ''
        },
        views: {
          viewMarkPage: '',
          viewCreateBatch: '',
          viewCreateMedal: '',
          viewExport: '',
          viewMarkTaskPage: '',
          viewMedalPage: '',
          viewMyIntegralDetail: '',
          viewResultPage: ''
        },
        flowTask: []
      },
      flow: [
        {
          step: 0,
          recovery: {
            isSubmitProcessed: true // 提交已标注
            // removeStatus: '0' // 删除文件类型// "0"/"1"/"-1"   默认值：0
          },
          giveup: {
            // isSubmitProcessed: false, // 是否提交已标注:  默认值false
            isRemoveResult: false // 是否删除result表中的结果
            // isUpdateResult: false, // 是否更新file中默认结果
            // removeStatus: '-1'// 删除文件类型// "0"/"1"/"-1"   默认值：-1
          },
          transfer: {
            isSubmitProcessed: true // 是否提交已处理的:  默认值true
            // isRemoveResult: false, // 是否删除result表中的结果
            // removeStatus: '0'// 删除文件类型// "0"/"1"/"-1"   默认值：0
          }
        },
        {
          step: 1,
          recovery: {
            isSubmitProcessed: true // 提交已标注
            // removeStatus: '0' // 删除文件类型// "0"/"1"/"-1"   默认值：0
          },
          giveup: {
            // isSubmitProcessed: false, // 是否提交已标注:  默认值false
            isRemoveResult: false // 是否删除result表中的结果
            // isUpdateResult: false, // 是否更新file中默认结果
            // removeStatus: '-1'// 删除文件类型// "0"/"1"/"-1"   默认值：-1
          },
          transfer: {
            isSubmitProcessed: true // 是否提交已处理的:  默认值true
            // isRemoveResult: false, // 是否删除result表中的结果
            // removeStatus: '0'// 删除文件类型// "0"/"1"/"-1"   默认值：0
          }
        },
        {
          step: 2,
          recovery: {
            isSubmitProcessed: true // 提交已标注
            // removeStatus: '0' // 删除文件类型// "0"/"1"/"-1"   默认值：0
          },
          giveup: {
            // isSubmitProcessed: false, // 是否提交已标注:  默认值false
            isRemoveResult: false // 是否删除result表中的结果
            // isUpdateResult: false, // 是否更新file中默认结果
            // removeStatus: '-1'// 删除文件类型// "0"/"1"/"-1"   默认值：-1
          },
          transfer: {
            isSubmitProcessed: true // 是否提交已处理的:  默认值true
            // isRemoveResult: false, // 是否删除result表中的结果
            // removeStatus: '0'// 删除文件类型// "0"/"1"/"-1"   默认值：0
          }
        }
      ],
      taskflowNode: ['createBatchTaskFlowId', 'taskExportTaskFlowId', 'createMedalTaskFlowId'],
      cname: {// 节点名称
        createBatchTaskFlowId: '创建批次任务流',
        taskExportTaskFlowId: '导出任务流',
        createMedalTaskFlowId: '勋章导入题库',
        recoveryStrategy: '回收策略',
        transferStrategy: '转移策略',
        viewMarkPage: '标注界面',
        viewCreateBatch: '创建批次',
        viewCreateMedal: '创建勋章',
        viewExport: '导出',
        viewMarkTaskPage: '标注任务查看',
        viewMedalPage: '勋章标注',
        viewMyIntegralDetail: '积分详情',
        viewResultPage: '查看结果'
      },
      historyViewList: {// 路由历史
        viewMarkPage: [],
        viewCreateBatch: [],
        viewCreateMedal: [],
        viewExport: [],
        viewMarkTaskPage: [],
        viewMedalPage: [],
        viewMyIntegralDetail: [],
        viewResultPage: []
      },
      loading: false, // 提交按钮 loading 显示状态
      searchValue: '', // 工作流快捷检索
      pipelineList: null// 可选工作流列表
    };
  },
  methods: {
    recoveryChange (value) {
      this.flow[0].recovery.isSubmitProcessed = value;
    },
    transferChange (value) {
      this.flow[0].transfer.isSubmitProcessed = value;
    },
    giveupMark (value) {
      this.flow[0].giveup.isRemoveResult = value;
    },
    giveupCheck (value) {
      this.flow[1].giveup.isRemoveResult = value;
    },
    giveupTest (value) {
      console.log(value)
      this.flow[2].giveup.isRemoveResult = value;
    },
    back () {
      this.$router.push({ path: '/home/linemanage/linelist' });
    },
    changeFlowTask (item) {
      for (let i = 0; i < this.pipelineList.length; i++) {
        if (item.value === this.pipelineList[i].id) {
          item.Name = this.pipelineList[i].name;
        }
      }
    },
    handleAdd () {
      this.busSetting.flowTask.push({
        value: '',
        Name: ''
      });
    },
    handleRemove (index) {
      this.busSetting.flowTask.splice(index, 1);
    },
    getBusDetail () {
      getListDetail(this.modelId)
        .then(res => {
          if (res) {
            if (res.data.tasks == null) {
              this.$Message.error('获取tasks失败');
            //   return;
            }
            if (res.data.views == null) {
              this.$Message.error('获取views失败,前端是否还没传页面呢？');
              // return;
            }
            this.modelId = res.data.modelId;
            if (res.data.isNew) {
              this.busSetting.isNew = res.data.isNew;
            }
            this.busSetting.modeName = res.data.modeName;
            this.busSetting.describe = res.data.describe;
            this.busSetting.modelId = res.data.modelId;
            this.busSetting.modelType = res.data.modelType;
            if (res.data.flowTask) {
              this.busSetting.flowTask = res.data.flowTask;
            }
            this.$set(this.busSetting, 'tasks', res.data.tasks);
            this.$set(this.busSetting, 'views', res.data.views);
            this.getBusKeys();
            if (this.busSetting.tasks.flow.length === 3) {
              this.flow = this.busSetting.tasks.flow;
            }
          }
        })
        .catch(err => {
          this.$Message.error('获取当前业务信息失败！详细信息：' + err);
        });
    },
    getBusKeys () {
      getKeys(this.modelId)
        .then(res => {
          if (res) {
            for (let i = 0; i < res.data.length; i++) {
              let item = res.data[i].views;
              for (let k in item) {
                this.historyViewList[k].push(item[k]);
              }
            }
            console.log(this.historyViewList)
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    saveBusiness () {
      this.loading = true;
      if (!this.busSetting.tasks) {
        this.$set(this.busSetting, 'tasks', {});
        this.$set(this.busSetting.tasks, 'createBatchTaskFlowId', '');
        this.$set(this.busSetting.tasks, 'taskExportTaskFlowId', '');
        this.$set(this.busSetting.tasks, 'recoveryStrategy', '');
        this.$set(this.busSetting.tasks, 'transferStrategy', '');
        this.$set(this.busSetting.tasks, 'createMedalTaskFlowId', '');
      };
      this.$set(this.busSetting.tasks, 'flow', this.flow);
      saveListDetail({ id: this.busSetting.modelId, modelType: this.busSetting.modelType, data: this.busSetting })
        .then(res => {
          if (res) {
            this.$Message.success('很棒，添加成功了！');
            this.$router.push({ path: '/home/linemanage/linelist' });
          }
          this.loading = false;
        })
        .catch(err => {
          this.$Message.error('添加失败，快看看接口咋地了？详细信息：' + err);
          this.loading = false;
        });
    },
    // 查询工作流列表
    getPipeline () {
      let param = {
        name: this.searchValue,
        pageIndex: 1,
        pageSize: 100
      };
      getPipeline(param).then(res => {
        if (res) {
          this.pipelineList = res.data.pipelineStates;
        }
      });
    }
  },
  created () {
    if (this.$route.query.edit) {
      this.edit = true;
    }
    if (this.$route.query.modelId) {
      this.modelId = this.$route.query.modelId;
      this.getBusDetail();
    }
    this.getPipeline();
  },
  mounted () {

  }
};
</script>

<style rel="stylesheet/less" lang="less" scoped>
.businessForm {
  border-top: 1px solid #d6d6d6;
  padding-top: 20px;
  .title {
    padding-left: 140px;
    font-size: 16px;
    line-height: 40px;
    font-weight: bold;
    padding-top: 20px;
  }
  .box{
    border-bottom:1px dashed #d6d6d6
    }
}
.line-detail {
  .table-blue {
    display: inline-block;
    margin: 20px;
    font-size: 12px;
    .icon-left {
      font-size: 12px;
    }
  }
}
</style>

<style lang="less">
</style>
